import React from 'react'
import TodoItem from '../TodoItem/TodoItem'
import "./TodoMain.css"
export default function TodoMain(props) {

    //解构
    let { todolist,deleteTodo,updateTodo } = props;

    return (
        <ul className="todo-main">
            {
                todolist.map(item =>{
                    return <TodoItem 
                                deleteTodo={deleteTodo} 
                                key={item.id}  
                                item={item} 
                                updateTodo={updateTodo}
                            />
                })
            }

           
            {
                todolist.length === 0 &&  <li className='todo-empty'>暂无数据！</li>
            }
        </ul>
    )
}
